<%--
  Created by IntelliJ IDEA.
  User: 韩金龙
  Date: 2021/11/5
  Time: 9:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/fileupload.js"></script>
    <link rel="stylesheet" href="css/css.css">
    <link rel="stylesheet" href="css/img.css">
</head>
<body>
    添加
    <form action="add.do" method="post">
        名称:<input type="text" name="cname"><br>
        图片:<div class="photoUpLoad" >
        <input type="file"   class="photo" name="photo" accept="image/*"><span class="cross">+</span>
        <img src="" alt="" class="photoEcho">
        </div><br>
        日期:<input type="text" name="ontime"><br>
        价格:<input type="text" name="price"><br>
        产地:<select name="sheng"><option value="">请选择</option> </select>
            <select name="shi"><option value="">请选择</option> </select>
            <select name="xian"><option value="">请选择</option> </select><br>
        颜色:<div id="coloe"></div><br>
        品牌:<select name="tid"><option value="">请选择</option> </select>
    </form>
    <button onclick="add()">添加</button>
</body>
<script>
    $(function () {//动态下拉
        //动态品牌
        $.ajax({
            url:"typeList.do",
            type:"post",
            dataType:"json",
            success:function (obj) {
                console.log(obj)
                for (let i in obj) {
                    $("[name='tid']").append("<option value="+obj[i].tid+">"+obj[i].tname+"</option>")
                }
                $("[name='tid']").val(${param.tid})
            }
        })
        //动态省
        $.ajax({
            url:"cityList.do",
            type:"post",
            dataType:"json",
            data:{"pid":0},
            success:function (obj) {
                console.log(obj)
                for (let i in obj) {
                    $("[name='sheng']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>")
                }
            }
        })
        //动态市
        $("[name='sheng']").change(function () {
            var id = $("[name='sheng']").val()
            $("[name='shi']").empty()
            $("[name='shi']").append("<option value=\"\">请选择</option>")
            $("[name='xian']").empty()
            $("[name='xian']").append("<option value=\"\">请选择</option>")
            $.ajax({
                url:"cityList.do",
                type:"post",
                dataType:"json",
                data:{"pid":id},
                success:function (obj) {
                    console.log(obj)
                    for (let i in obj) {
                        $("[name='shi']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>")
                    }
                }
            })
        })
        //动态县
        $("[name='shi']").change(function () {
            var id = $("[name='shi']").val()
            $("[name='xian']").empty()
            $("[name='xian']").append("<option value=\"\">请选择</option>")
            $.ajax({
                url:"cityList.do",
                type:"post",
                dataType:"json",
                data:{"pid":id},
                success:function (obj) {
                    console.log(obj)
                    for (let i in obj) {
                        $("[name='xian']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>")
                    }
                }
            })
        })
        //动态复选
        $.ajax({
            url:"colorList.do",
            type:"post",
            dataType:"json",
            success:function (obj) {
                console.log(obj)
                for (let i in obj) {
                    $("#coloe").append('<input type="checkbox" name="coids" value="'+obj[i].coid+'">'+obj[i].coname+'')
                }
            }
        })
    })
    function add() {
        var formData = new FormData($("form")[0]);
        $.ajax({
            url:"add.do",
            type:"post",
            dataType:"json",
            data:formData,
            processData: false,
            contentType:false,
            success:function (obj) {
                if (obj>0){
                    alert("添加成功!!")
                    location="list.do"
                }
            }
        })
    }
</script>
</html>
